import wxCharts from '../../utils/wxcharts.js'
Page({

  /**
   * 页面的初始数据
   */
  data: {
    // 模拟温度-时间数据
    temperatureData: [
      { time: '08:00', temperature: 27 },
      { time: '09:00', temperature: 23 },
      { time: '10:00', temperature: 27 },
      { time: '11:00', temperature: 24 },
      { time: '12:00', temperature: 28 },
      // 添加更多数据...
    ],
    // 模拟列表数据
    dataList0: [
      { value: '数值1', updateTime: '2024-01-01 08:00' },
      { value: '数值2', updateTime: '2024-01-01 09:00' },
      { value: '数值3', updateTime: '2024-01-01 10:00' },
      { value: '数值4', updateTime: '2024-01-01 10:00' },
      // 添加更多数据...
    ],
  tabsId: 0, //默认选型为装备
  dataList: [], // 列表数据
  page: 1, // 当前页数
  pageSize: 10, // 每页数据条数
  loading: false ,// 加载状态标识
  timeRangeIndex: 0,
  timeRange: ['最近60分钟', '4小时内', '24小时内'],
  date: '2024-01-01', //默认起始时间
  date2: '2024-01-24', //默认结束时间
  animate: 'myfirst',
  yesorno: 'none',
  flag: true,
  test: 'test1',
  category: '', // 保存当前选中的类别
  feature: '', // 保存当前选中的特色
    showModal: false,
    tabList: [
      {title: "产品/场景概况",index: "0",},
      {title: "报警记录",index: "1",},
      {title: "历史数据",index: "2",}
  ],
  tabsId: 0, //默认选型为装备
  language:['CTA频率','温度','湿度','土壤水分','气压']
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {

  },
  preventTouchMove: function () {
  },
  /**
   * 隐藏模态对话框
   */
  hideModal: function () {
    this.setData({
      showModal: false
    });
  },
  /**
   * 对话框取消按钮点击事件
   */
  onCancel: function () {
    this.hideModal();
  },
  onConfirm: function () {
    this.hideModal();
  },
  xiugai(){
    this.setData({
      showModal: true
    })
  },

   // 滑动时触发的事件
   slideOn(e) {
    // 拿到当前索引并动态改变
    this.setData({
        tabsId: e.detail.current
    })
},

//点击tab时触发
tabsOn(e) {
    this.setData({
        //拿到当前索引并动态改变
        tabsId: e.currentTarget.dataset.idx
    })
},

  handleCategoryClick(e) {
    const category = e.currentTarget.dataset.category;
    this.setData({
      category
    });
  },

  handleFeatureClick(e) {
    const feature = e.currentTarget.dataset.feature;
    this.setData({
      feature
    });
  },

  clearSelection() {
    this.setData({
      category: '',
      feature: ''
    });
  },

  fabiao: function () {
    this.setData({
      yesorno: 'block',
      test: 'test1',
      flag: false
    });
  },

  laqi: function () {
    this.setData({
      test: 'test2',
      flag: true
    });
  },

  bindTimeRangeChange: function (e) {
    this.setData({
      timeRangeIndex: e.detail.value
    });
  },

  bindDateChange(e) {
    this.setData({
      date: e.detail.value
    });
  },

  bindDateChange2(e) {
    this.setData({
      date2: e.detail.value
    });
  },

  onInput(e) {
    this.setData({
      keyword: e.detail.value
    });
    this.filterList();
  },

  goToDetail: function(event) {
    const id = event.currentTarget.dataset.id;
    wx.navigateTo({
      url: '/pages/warnDetail/warnDetail?id=' + id,
      success: () => {
        // 在成功跳转后再设置dataList的值
        wx.request({
          url: 'http://192.168.245.55:3000/selectById1/data',
          success: (res) => {
            this.setData({
              dataList1: res.data
            });
          }
        });
      }
    });
},
  onReady() {
    wx.request({
      url: 'http://192.168.245.55:3000/selectById1/data',
      success: (res) => {
        this.setData({
          dataList1: res.data
        });
      }
    });
    // 在页面渲染完成后绘制图表
    this.drawChart();
  },
  drawChart: function () {
    const that = this;
    const lineChart = new wxCharts({
      canvasId: 'lineChart',
      type: 'line',
      categories: this.data.temperatureData.map(item => item.time),
      series: [{
        name: '温度',
        data: this.data.temperatureData.map(item => item.temperature),
        format: function (val) {
          return val.toFixed(2);
        }
      }],
      width: 375,
      height: 200,
      xAxis: {
        disableGrid: true // 去掉时间轴上的竖线
      },
      extra: {
        lineChart: {
          touchHandler: function (e) {
            console.log(lineChart.getCurrentDataIndex(e));
            // 在这里处理点击事件，根据点击的点显示详细信息等操作
          },
          tooltip: {
            showBox: true, // 显示tooltip弹框
            format: function (item, category) {
              return category + ' ' + item.data
            }
          }
        }
      }
    });
  },
  
  onLoad: function () {
    // 页面加载时加载数据
    this.loadData();
    this.drawChart();  // 在页面加载时调用 drawChart 函数
  },
  

loadData: function () {
    // 模拟异步加载数据
    // 这里可以是请求后端接口获取数据的逻辑
    let that = this;
    wx.request({
        url: 'http://192.168.245.55:3000/api1/data',
        method: 'GET',
        data: {
            page: that.data.page,
            pageSize: that.data.pageSize
        },
        success: function (res) {
            let newData = res.data; // 新加载的数据
            that.setData({
                dataList: that.data.dataList.concat(newData),
                page: that.data.page + 1,
                loading: false
            });
        }
    });
},

loadMore: function () {
    // 触发加载更多数据
    if (!this.data.loading) {
        this.setData({
            loading: true
        });
        this.loadData();
    }
},
  onHide() {

  },

  onUnload() {

  },

  onReachBottom() {

  },

  onShareAppMessage() {

  },
  onPullDownRefresh: function () {
    // 下拉刷新时重新请求数据
    wx.request({
      url: 'http://192.168.245.55:3000/selectById1/data',
      success: (res) => {
        this.setData({
          dataList: res.data
        });
        wx.stopPullDownRefresh(); // 停止下拉刷新动画
      }
    });
},

  slideOn(e) {
    this.setData({
      tabsId: e.detail.current
    });
  },

  tabsOn(e) {
    this.setData({
      tabsId: e.currentTarget.dataset.idx
    });
  }
})